<style lang='scss' scoped>
	.cate {
		.title {
			border-top: 1rpx solid mediumvioletred;
			border-bottom: 1rpx solid mediumvioletred;
			padding: 20rpx 0 20rpx 10rpx;
			color: darkred;
		}

		.header {
			height: calc(100vh - 260rpx);
			overflow: auto;

			.list {
				display: flex;
				box-sizing: border-box;
				align-items: center;
				.label {
					width: 100rpx;
				}

				.image {
					width: 150rpx;

					image {
						width: 100%;
					}
				}

				.warp {
					flex: 1;
					padding: 20rpx;

					.titile {
						font-size: 30rpx;
						display: -webkit-box;
						-webkit-line-clamp: 2;
						overflow: hidden;
						text-overflow: ellipsis;
						-webkit-box-orient: vertical;
					}

					.button {
						display: flex;
						justify-content: space-between;

						.price {
							color: orangered;
						}

						.arrow {
							display: flex;
							align-items: center;

						}
					}
				}


			}
		}

		.kong {
			image {
				width: 100%;
			}
		}

		.footer {
			width: 100vw;
			display: flex;
			position: fixed;
			bottom: 0;
			left: 0;

			view {
				flex: 1;
				text-align: center;
				height: 80rpx;
				line-height: 80rpx;
			}

			:nth-child(3) {
				background-color: #FF5A5F;
			}
		}
	}
</style>
<template>
	<view class='zhifu'>
		<view class='cate'>
			<view class="kong" v-if="shoplist.length == 0">
				<image
					src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fi1.hdslb.com%2Fbfs%2Farchive%2Fc6ac03e15f4b5efc7e2a268970ce660baab1ba21.jpg_320x200.jpg&refer=http%3A%2F%2Fi1.hdslb.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1663241098&t=7025eb03c453abb6dd9a6f7d5944feed"
					mode="widthFix"></image>
			</view>
			<view class="header" v-else>
				<view class="list" v-for="(item,index)  in zhifulist" :key="index">
					<view class="image">
						<image :src="item.img || '../../static/52b1464290643af26775f95b539de4c0.jpeg'" mode="widthFix">
						</image>
					</view>
					<view class="warp">
						<div class="titile">{{item.goods_name}}</div>

						<view class="button">
							<text class="price">¥{{item.goods_price}}</text>
							<view class="arrow">
								<text>X{{item.num}}</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="footer">
				<view>

				</view>
				<view>
					合计：￥{{totaPrice}}
				</view>
				<view @click="yes">
					支付：({{totalNum}})
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		api
	} from "@/utils/index.js"
	export default {
		data() {
			return {
				zhifulist: [],
				totalNum: 0,
				totaPrice: 0
			}
		},
		onLoad(o) {},
		onShow() {
			let zhifulist = uni.getStorageSync('zhifulist')
			this.zhifulist = zhifulist

			let num = 0
			let price = 0
			zhifulist.forEach(v => {
				if (v.flag) {
					num += v.num
					price += v.num * v.goods_price
				}
			})
			this.totalNum = num
			this.totaPrice = price
		},
		methods: {
			yes() {
				let goodss = []
				this.zhifulist.forEach(v => {
					let obj = {
						goods_price: v.goods_price,
						goods_id: v.goods_id,
						goods_number: v.num
					}
					goodss.push(obj)
				})
				let data = {
					order_price: this.totaPrice,
					consignee_addr: "广东省广州市海珠区新港中路397号",
					goods: goodss
				}
				api({
					url: 'public/v1/my/orders/create',
					method: "post",
					data
				}).then(res => {
					if (res.meta.status == 200) {
						uni.showToast({
							title: res.meta.msg,
							mask: true
						})
						this.sccode(res.message.order_number)
						this.state(res.message.order_number)
					} else {
						uni.showToast({
							title: res.meta.msg,
							mask: true,
							icon: "error"
						})
					}
				})

			},
			sccode(order_number) {
				let data = {
					order_number: order_number
				}
				api({
					url: "public/v1/my/orders/req_unifiedorder",
					method: "post",
					data
				}).then(async res => {
					await this.apia(res.message.pay)
				})
			},
			async apia(pay) {
				const response = await uni.requestPayment(pay)
				console.log(response);
			},
			state(order_number) {
				let data = {
					order_number: order_number
				}
				api({
					url: 'public/v1/my/orders/chkOrder',
					method: 'post',
					data
				}).then(res => {
					console.log(res);
				})
			}
		}
	}
</script>
